<template>
	<view class="page">
		<div class="sc-card marginlr0 " style="border-radius: 0;">
			<div class="img-box" style="height:45vw; background-image:url(https://img.zcool.cn/community/0173585543ec860000019ae9a18bf6.jpg@2o.jpg); background-size: cover; border-radius: 0;"></div>
			<view class="sc-zj-logo-w">
				<image class="sc-zj-logo " src="http://www.16buzhi.com/uploads/allimg/170914/1-1F9141FJ6.jpg" mode=""></image>
				<text class="mc"  >郑州校友会</text>
			</view>
			<span class="sc-mark-rb sc-top"><a class="iconfont icon-wode1"></a></span>
			<span class="sc-mark-rb sc-top right"><a class="iconfont icon-saoma"></a></span>
		</div>
		<!-- pic end -->
		<!-- 数据 -->
		<view class="home-data u-f-ac">
			<view class="u-f1 u-f-ajc u-f-column">
				<view>74</view>浏览
			</view>
			<view class="u-f1 u-f-ajc u-f-column">
				<view>20</view>成员
			</view>
			<view class="u-f1 u-f-ajc u-f-column">
				<view>10</view>活动
			</view>
			<view class="u-f1 u-f-ajc u-f-column">
				<view>5</view>留言
			</view>
		</view>
		<div class="sc-glx bg-white" style="margin-top: -50px; padding-top:50px">
			<h4 class="padding20-l f14 f-njc">管理项</h4>
			<div class="weui-grids">
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-zuzhi "></span>
					</div>
					<p class="weui-grid__label">
						成员管理
					</p>
				</a>
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-huodong "></span>
					</div>
					<p class="weui-grid__label">
						活动管理
					</p>
				</a>
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-toupiao"></span>
					</div>
					<p class="weui-grid__label">
						投票管理
					</p>
				</a>
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-zixun "></span>
					</div>
					<p class="weui-grid__label">
						资讯管理
					</p>
				</a>
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-tupian "></span>
					</div>
					<p class="weui-grid__label">
						相册管理
					</p>
				</a>
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-liuyan003 "></span>
					</div>
					<p class="weui-grid__label">
						留言管理
					</p>
				</a>
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-mingpian"></span>
					</div>
					<p class="weui-grid__label">
						联系我们
					</p>
				</a>
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-jibenxinxi "></span>
					</div>
					<p class="weui-grid__label">
						基本信息
					</p>
				</a>
				<a href="javascript:;" class="weui-grid js_grid">
					<div class="weui-grid__icon">
						<span class="iconfont icon-zuzhi1 "></span>
					</div>
					<p class="weui-grid__label">
						组织简介
					</p>
				</a>
			</div>
		</div>
		<div class="weui-cells_form  margin10-t">
			<div class=" weui-cells ">
				<a class="weui-cell weui-cell_access" href="javascript:;">
					<div class="weui-cell__bd">
						<p>成员加入组织权限范围</p>
					</div>
					<div class="weui-cell__ft f14">
						公开 </div>
				</a>

				<div class="weui-cell weui-cell_switch">
					<div class="weui-cell__bd">成员加入是否需要审核</div>
					<div class="weui-cell__ft">
						<switch checked color="#09BB07" />
					</div>
				</div>
				<a class="weui-cell weui-cell_access" href="javascript:;">
					<div class="weui-cell__bd">
						<p>相册查看权限范围</p>
					</div>
					<div class="weui-cell__ft f14">
						公开</div>
				</a>
				<div class="weui-cell weui-cell_switch">
					<div class="weui-cell__bd">成员发起活动是否需要审核</div>
					<div class="weui-cell__ft">
						<switch checked color="#09BB07" />
					</div>
				</div>
				<div class="weui-cell weui-cell_switch">
					<div class="weui-cell__bd">成员发起投票是否需要审核</div>
					<div class="weui-cell__ft">
						<switch checked color="#09BB07" />
					</div>
				</div>


			</div>
			<!-- weui-cells end -->
		</div>

	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>
	.page {
		background: #f7f7f7;
	}

	.sc-mark-rb {
		border-radius: 50%;
		bottom: 0.825em !important;
		color: #fff;
		width: 1.75rem;
		height: 1.75rem;
		line-height: 1.75rem;
		position: absolute;
		right: 3rem;
		text-align: center;
		padding: 0.1em;
		background-color: rgba(255, 255, 255, 0.5);
	}
	.sc-mark-rb.sc-top{
		top: 0.825em !important;
		bottom:auto;
	}
	.sc-mark-rb.right {
		right: 0.5rem;
	}

	.sc-mark-rb a {
		color: #000;
		font-size: 1rem;
		opacity: 1;
	}

	.marginlr0 {
		margin: 0.625rem 0 !important;
	}

	.weui-cell:before {
		left: 0;
	}

	.weui-grid {
		padding: 0.3125rem 0.625rem;
	}

	.weui-grids:before,
	.weui-grid:before,
	.weui-grid:after {
		border: none;
	}

	.weui-grid__icon {
		height: auto;
	}

	.sc-glx .iconfont {
		font-size: 1.5rem;
		color: #07C160;
	}

	.home-data {
		position: relative;
		margin: -90upx 40upx 20upx 40upx;
		padding: 10upx;
		background: #fff;
		-webkit-box-shadow: 0 5upx 10px rgba(0, 0, 0, 0.2);
		box-shadow: 0 5upx 10px rgba(0, 0, 0, 0.1);
		border-radius: 20upx;
	}

	.home-data>view {
		color: #989898;
	}

	.home-data>view>view {
		font-size: 32upx;
		color: #333333;
	}
	.sc-zj-logo-w{
		position: absolute;
		top: 10%;
		left: 0;
		color: #fff;
		padding: 30upx 0;
		width: 100%;
		text-align: center;
	}
	.sc-zj-logo{
		width: 100upx;
		height: 100upx;
		border-radius: 100%;
		display: block;
		margin: 0 auto;
	}
	.sc-zj-logo-w .mc{
			display: block;
			text-align: center;
	}
	.sc-zj-logo img{
		border-radius: 100%;
		padding:30upx;
	}
</style>
